<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/css/font.css}">
    <link rel="stylesheet" th:href="@{/css/xadmin.css}">
    <script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
    <script type="text/javascript" th:src="@{/js/xadmin.js}"></script>
    <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
</head>

<body style="background-color:#FFFAE3">
<div class="x-nav" style="height: 43px">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
          </span>
    <i class="layui-icon layui-icon-refresh" style="line-height:35px"></i></a>
</div>
<div id="div1">
    <table style="margin-left: 10px" class="layui-hide" id="text" lay-filter="demo"></table>
</div>
<div id="div2">
    <table class="layui-table" style="text-align: center">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th colspan="4" style="text-align: center;font-size: 20px;font-weight: bold;">编制采购计划</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">采购计划编号</td>
            <td style="width: 400px" id="stockNum"></td>
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">采购计划名称</td>
            <td style="width: 400px"><input type="text" id="stockName" name="title" lay-verify="title"
                                            autocomplete="off" class="layui-input"></td>
        </tr>
        <tr>
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">公司名称</td>
            <td style="width: 400px">长沙北大青鸟有限公司</td>
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">编制人</td>
            <td style="width: 400px">[[${session.employee.empName}]]</td>
        </tr>
        <tr>
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">预算金额(元)</td>
            <td style="width: 400px"><input type="text" id="budget" name="title" lay-verify="title" autocomplete="off"
                                            class="layui-input"></td>
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">采购计划编制时间</td>
            <td style="width: 400px" id="date"></td>
        </tr>
        </tbody>
    </table>
    <table style="margin-left: 10px" class="layui-hide" id="table" lay-filter="demo"></table>
    <table class="layui-table" style="text-align: center">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="200">
            <col>
        </colgroup>
        <tbody>
        <tr>
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">采购方式</td>
            <td style="width: 800px" class="demoTable">
                <div class="layui-inline">
                    <select name="stockType" onchange="changeSel(this)" id="stockType" lay-filter="ReportType" lay-verify="required">
                        <option value="定向询价">定向询价</option>
                    </select>
                </div>
            </td>
        </tr>
        <tr id="trr">
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">满足条件的供应商列表</td>
            <td style="width: 800px">
                <table style="margin-left: 10px" id="tableMZ" lay-filter="demo"></table>
            </td>
        </tr>
        <tr>
            <td style="background-color: #F2F2F2;font-weight: bold;width: 230px">说明：（400字以内）</td>
            <td style="width: 800px">
                <input type="text" id="remark" name="title" lay-verify="title" autocomplete="off" class="layui-input">
            </td>
        </tr>
        </tbody>
    </table>
    <div class="layui-input-block">
        <button type="reset" onclick="buttonQueDing()" class="layui-btn layui-btn-primary">确定</button>
        <button type="button" onclick="Cls()" class="layui-btn" lay-submit="" lay-filter="demo1">取消</button>
    </div>
</div>
</body>
<script id="toolbarDemo" type="text/html" style="background-color:#FFFAE3">
    <div className="layui-btn-container" style="font-size: 20px;font-weight: bold;width: 500px;margin-left: 560px;"
         id="divLeft" >
        未编采购计划的需求一览表
    </div>
    <div class="demoTable" style="margin: auto;margin-top: 15px">
        物资编码:
        <div class="layui-inline">
            <input class="layui-input" name="materialCode" id="materialCode" autocomplete="off">
        </div>
        物资名称:
        <div class="layui-inline">
            <input class="layui-input" name="materialName" id="materialName" autocomplete="off">
        </div>
        <button class="layui-btn" data-type="reload" onclick="buttonSS()" id="search">查询</button>
    </div>
    <button lay-event="getCheckData" class="layui-btn" data-type="reload"
            style="position: absolute;left: 1120px;top: 50px;">编制采购计划
    </button>
</script>
<script>

    function changeSel(){
        alert(123)
        $.ajax({
            url: "/supplier/SelByMat",
            data: {
                "ids": iids,
            },
            type: "GET",
            success: function (result1) {
                for (let result1Element of result1) {
                    gysId.push(result1Element.id)
                    continue
                }
                layui.use('table', function () {
                    var table = layui.table;
                    table.render({
                        elem: '#tableMZ'  //html中渲染table的id
                        ,data:result1
                        , cellMinWidth: 80
                        , cols: [
                            [
                                //表单显示的title以及返回的需要显示的数据，field值与获取集合中的类的字段名一致。
                                {field: 'company',  title: '供应商名称', align: 'center'}
                            ]
                        ]
                    });
                })
            }
        })
        $("#trr").show();
    }
    var iids=[];
    var iidds=[];
    var gysId=[];
    layui.use('table', function () {
        $("#trr").hide();
        $("#div2").hide();
        var table = layui.table;
        table.render({
            elem: '#text'  //html中渲染table的id
            , url: '/orders/find1'   //后台获取数据集合的地址
            , cellMinWidth: 80
            , toolbar: '#toolbarDemo'
            , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                , groups: 1 //只显示 1 个连续页码
                , first: false//不显示首页
                , last: false //不显示尾页

            }, cols: [
                [
                    //表单显示的title以及返回的需要显示的数据，field值与获取集合中的类的字段名一致。
                    {title: '选择', toolbar: "#checkbox", type: 'checkbox', align: 'center'}
                    , {field: 'id', sort: true, title: '序号', align: 'center'}
                    , {field: 'materialCode', sort: true, title: '物资代码', align: 'center'}
                    , {field: 'materialName', title: '物资名称', align: 'center'}
                    , {field: 'amount', sort: true, title: '数量', align: 'center'}
                    , {field: 'unitPrice', title: '预算价格', align: 'center'}
                    , {field: 'startDate', sort: true, title: '需求时间', align: 'center'}
                ]
            ], id: 'tableAll'
        });
        table.on('toolbar(demo)', function (obj) {
            var id = obj.config.id;
            var checkStatus = table.checkStatus(id);
            if (checkStatus.data[0] != null) {
                switch (obj.event) {
                    case 'getCheckData':
                        var data = checkStatus.data;
                        let list = [];
                        for (let i = 0; i < data.length; i++) {
                            list.push(data[i].id)
                        }
                        $.ajax({
                            url: "/stock/Insert",
                            data: {
                                "ids": list,
                            },
                            type: "POST",
                            success: function (result) {
                                $("#div1").hide();
                                $("#div2").show();
                                var orders=result.orders;
                                for (let order of orders) {
                                    iidds.push(order.id)
                                }
                                $("#stockNum").html(result.stockNum);
                                $("#stockName").html(result.stockName);
                                $("#budget").html(result.budget);
                                var myDate = new Date;
                                var year = myDate.getFullYear(); //获取当前年
                                var mon = myDate.getMonth() + 1; //获取当前月
                                var date = myDate.getDate(); //获取当前日
                                $("#date").html(year + "年" + mon + "月" + date + "日");
                                layui.use('table', function () {
                                    var table = layui.table;
                                    table.render({
                                        elem: '#table'  //html中渲染table的id
                                        , data: orders   //后台获取数据集合的地址
                                        , cols: [
                                            [
                                                //表单显示的title以及返回的需要显示的数据，field值与获取集合中的类的字段名一致。
                                                , {field: 'id', title: '序号', align: 'center'}
                                                , {width: 200, field: 'materialCode', title: '物资编码', align: 'center'}
                                                , {width: 340, field: 'materialName', title: '物资名称', align: 'center'}
                                                , {width: 110, field: 'amount', title: '数量', align: 'center'}
                                                , {width: 110, field: 'measureUnit', title: '计量单位', align: 'center'}
                                                , {width: 110, field: 'startDate', title: '交货期', align: 'center'}
                                                , {width: 110, field: 'unitPrice', title: '协议价格（元）', align: 'center'}
                                                , {width: 110, field: 'sumPrice', title: '预算总金额（元）', align: 'center'}
                                                , {width: 110, field: 'startDate', title: '计划价（元/不含税）', align: 'center'}
                                            ]
                                        ]
                                    });
                                });
                                for (let order of orders) {
                                    iids.push(order.materialCode)
                                }
                                changeSel()
                            }
                        })
                }
            }
            else
            {
                layer.confirm('请至少选择一个需求计划!', function (index) {
                    layer.close(index);
                });
            }
        });
    });

    function buttonSS() {
        var table = layui.table;
        table.reload('tableAll', {
            method: 'post',
            where: {
                materialCode: $.trim($('#materialCode').val()),
                materialName: $.trim($('#materialName').val())
            },
            page: {
                curr: 1
            }
        });
    };

    function buttonQueDing() {
        var stockName = $("#stockName").val();
        var budget = $("#budget").val();
        var stockType = $("#stockType").val();
        var remark = $("#remark").val();
        var stockNum = $("#stockNum").html();
        if (stockName == null || stockName == '' || budget == null || budget == '' || stockType == null || stockType == '') {
            layer.alert("未填写！");
        } else {
            $.ajax({
                url: "/stock/QueDing",
                data: {
                    "stockName": $.trim(stockName),
                    "budget": $.trim(budget),
                    "stockType": $.trim(stockType),
                    "remark": $.trim(remark),
                    "stockNum": $.trim(stockNum),
                    "ssStatic":'未报批',
                    "iidds":iidds,
                    "gysId":gysId
                },
                type: "GET",
                success: function (result) {
                    if ($.trim(result) == "true") {
                        layer.alert("编制成功！");
                        location.href = "/planman/Project_list.html";
                    }
                }
            });
        }
    }
</script>
</html>